<template>
  <BasicLayout :title="clauseData.title">
    <template slot="content">
      <h1 class="title">{{ clauseData.title }}</h1>
      <ul>
        <li v-for="(item, index) in clauseData.content" :key="index">
          {{ index + 1 }}、{{ item }}
        </li>
      </ul>
    </template>
  </BasicLayout>
</template>

<script>
import BasicLayout from "@/components/BasicLayout/index.vue";
export default {
  components: {
    BasicLayout,
  },
  data() {
    return {
      clauseData: {},
    };
  },
  created() {
    const { title } = this.$route.params;
    // 根据title来匹配对应的条款数据
    switch (title) {
      case "用户注册条款": {
        import("@/constants/clause/register").then(
          ({ registerPeopleClause }) => (this.clauseData = registerPeopleClause)
        );
        break;
      }
      case "陪诊员注册条款": {
        import("@/constants/clause/register").then(
          ({ registerStaffClause }) => (this.clauseData = registerStaffClause)
        );
        break;
      }
      case "用户服务条款": {
        import("@/constants/clause/service").then(
          ({ servicePeopleClause }) => (this.clauseData = servicePeopleClause)
        );
        break;
      }
      case "陪诊员服务条款": {
        import("@/constants/clause/service").then(
          ({ serviceStaffClause }) => (this.clauseData = serviceStaffClause)
        );
        break;
      }
      default:
    }
  },
};
</script>

<style scoped>
.title {
  text-align: center;
}
</style>
